

import React,{Component,PropTypes} from 'react'
import utils from '../../utils'
export default class Numbers extends Component{
  static defaultProps = {
    className: '',
    minNum:1
  }
  static propTypes={
    className:PropTypes.string, // 类名
    value : PropTypes.number,
    minNum:PropTypes.number
  }
  onNumber(type,e){
    let {value,onCallBack,minNum} = this.props
    if(type==='sub'){
      if(value==minNum) return
      onCallBack(value-1)
    }
    else{
      onCallBack(value+1)
    }
    
  }
  onTextChange(e){
    let {onCallBack} = this.props
    let num = utils.onValidNumber(e.target.value)
    onCallBack(num)
  }
  toValueTrue(){
    let {value,onCallBack} = this.props
    if(!value){ 
      return onCallBack(value+1)
    }
  }
  render(){
    let {className,value} = this.props
    return(
      <div className={`m-selnum jia-jian ${className}`}>
        <span className="jian less "  onClick={this.onNumber.bind(this,'sub')}>
          <i className="hx "></i>
        </span>
        <div className="textWrap">
          <input type="tel" className="num-input" value={value} onChange={this.onTextChange.bind(this)} onBlur={
            this.toValueTrue.bind(this)}  />
        </div>
        <span className="more jia" onClick={this.onNumber.bind(this,'add')}>
          <i className="hx"></i>
          <i className="sx"></i>
        </span>
      </div>
    )
  }
}